<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script src="./js/a.js"></script>
  <script>

    // 1. 全局变量可能被随意的污染
    // a.js
    // var a = 100;

    // a = "hello"
    // console.log(a);

    // 2.函数自执行：
    // function fn1() {
    //   var b = 100;

    //   console.log(b);  // 100, 函数内的变量，不可以再函数外被修改。原因：作用域的限制
    // }
    // b = "sss"
    // fn1();

    // 基本的语法：
    (function () {
      var c = 10000;
      console.log(c);

      function getValue() {
        return c;
      }

      function setValue(n) {
        c = n;
      }
      // 暴露函数内部接口：
      window.getC = getValue;
      window.setC = setValue;
    })();

    // console.log(c) // c is not defined

    // 现在是实现了c变量的保护，函数外不可以操作c。那么怎么样才可以再函数外面，可以安全的操作c的值？

    console.log(window.getC()) //10000
    console.log(getC()) //10000

    // var x = "Xxx0"
    // console.log(window.x) //"Xxx0"

    setC("abcd")
    console.log(getC()) // "abcd"

    // 1.通过函数自执行，隐藏你需要隐藏的变量。
    // 2. 通过给window添加属性，可以公开一部分东西出来。
    c = "aaa"
    console.log(getC())  //abcd
  </script>
</body>

</html>